/**
 * @description 阈值设置页面公用右侧部分
 * @author gf
 */
import styled from "styled-components";
import LittleTitle from "@/components/Title/littleTitle";
import { Fragment, useEffect, useState } from "react";
import InlineInput from "./InlineInput";
import { EVENT_INLINE_INPUT } from "./InlineInput";
import SingleInput from "./SingleInput";
import { EVENT_SINGLE_INPUT } from "./SingleInput";
import MultipleInput, {
  EVENT_INLINE_INPUT as MUL_EVENT_INLINE_INPUT,
} from "./MultipleInput";
import RowMultipleInput, {
  EVENT_INLINE_INPUT as ROW_MUL_EVENT_INLINE_INPUT,
} from "./RowMultipleInput";
import * as _ from 'lodash'

import SelectInput from "./SelectInput";
import { EVENT_SELECT_INPUT } from "./SelectInput";
import { saveFundPreVal } from "@/pages/SigFundParams/service"; // 单基
import { savePortfolioPreVal } from "@/pages/ComParams/service"; // 组合
import { message } from "antd";
import styles from "./index.less";
import cn from "classnames";
import icon_open from "@/assets/icons/icon-open.png";

import DoubleInput, {
  EVENT_INLINE_INPUT as DOUBLE_EVENT_INLINE_INPUT,
} from "./DoubleInput";

import EventEmpty from "./EventEmpty";

const DivRight = styled.div`
  position: relative;
  flex-grow: 1;
  min-width: 700px;
  height: 100%;
  margin-left: 8px;
  padding-left: 8px;
  overflow-y: auto;
  border-left: 1px solid #e4e4e4;
`;

const PageRight = (props: any) => {
  const { values, handleQueryTree } = props;
  const [isOpen, setIsOpen] = useState(false);
  const [pVal, setPVal] = useState<any>({})
  // values是点击左侧树传出的数据，preValue是阈值的一些数据

  // 接口调用
  const onSubmit = (params: any) => {
    params.enable = isOpen
    if(!params?.preValue) {
      // 处理空的情况
      params.preValue = {}
      params.dataMemo = ''
    }
    if (values.fundType === "com") {
      // 组合
      savePortfolioPreVal(params).then((res) => {
        if (res?.code === "0") {
          message.success(res?.msg || "保存成功");
          handleQueryTree(params)
        }
      });
    } else {
      // 单基
      saveFundPreVal(params).then((res) => {
        if (res?.code === "0") {
          message.success(res?.msg || "保存成功");
          handleQueryTree(params)
        }
      });
    }
  };

  useEffect(() => {
    setIsOpen(values.enable);
    setPVal(values)
  }, [values]);

  // console.log("right-info", values, values.preValue);

  // 切换开关
  const handleToggleCheck = () => {
    setIsOpen(!isOpen);
  };

  return (
    <DivRight>
      <div
        style={{
          display: "flex",
          alignItems: "center",
          justifyContent: "space-between",
        }}
      >
        <LittleTitle title={pVal.title || "-"} mt="0" />
        <div
          className={cn(styles.baseBtn, isOpen ? styles.open : styles.close)}
          onClick={handleToggleCheck}
        >
          <span>{isOpen && <img src={icon_open} alt="" />}</span>
          <span>提醒开启</span>
        </div>
      </div>

      <Fragment>
        {/* 此处根据事件类型放置不同模板 */}
        {EVENT_SELECT_INPUT.includes(pVal.value) && (
          <SelectInput
            onSubmit={onSubmit}
            eventInfo={pVal}
            thresholdValue={pVal.preValue}
            enable={isOpen}
          />
        )}

        {EVENT_INLINE_INPUT.includes(pVal.value) && (
          <InlineInput
            onSubmit={onSubmit}
            eventInfo={pVal}
            thresholdValue={pVal.preValue}
            enable={isOpen}
          />
        )}
        {EVENT_SINGLE_INPUT.includes(pVal.value) && (
          <SingleInput
            onSubmit={onSubmit}
            eventInfo={pVal}
            thresholdValue={pVal.preValue}
            enable={isOpen}
          />
        )}
        {pVal?.value && MUL_EVENT_INLINE_INPUT.includes(pVal?.value) && (
          <MultipleInput
            onSubmit={onSubmit}
            thresholdValue={pVal.preValue}
            eventInfo={pVal}
            enable={isOpen}
          />
        )}
        {pVal?.value &&
          ROW_MUL_EVENT_INLINE_INPUT.includes(pVal?.value) && (
            <RowMultipleInput
              onSubmit={onSubmit}
              thresholdValue={pVal.preValue}
              eventInfo={pVal}
              enable={isOpen}
            />
          )}
        {pVal?.value && DOUBLE_EVENT_INLINE_INPUT.includes(pVal?.value) && (
          <DoubleInput
            onSubmit={onSubmit}
            thresholdValue={pVal.preValue}
            eventInfo={pVal}
            enable={isOpen}
          />
        )}
        {_.isEmpty(pVal.preValue) && <EventEmpty  onSubmit={onSubmit} eventInfo={pVal} enable={isOpen} />}
      </Fragment>
    </DivRight>
  );
};

export default PageRight;
